<template>
    <div class="edit-popup">
        <el-form
            ref="formRef"
            :model="formData"
            label-width="104px"
            :rules="formRules"
            :inline="true"
        >
            <el-form-item label="我方文号" prop="ourRef" class="w-[47%]">
                <el-input v-model="formData.ourRef" placeholder="请输入我方文号" />
            </el-form-item>
            <el-form-item label="案件名称" prop="caseName" class="w-[47%]">
                <el-input v-model="formData.caseName" placeholder="请输入案件名称" />
            </el-form-item>
            <el-form-item label="处理事项" prop="handlingInformation" class="w-[47%]">
                <el-input v-model="formData.handlingInformation" placeholder="请输入处理事项" />
            </el-form-item>
            <el-form-item label="申请类型" prop="putinType" class="w-[47%]">
                <el-select
                    clearable
                    class="flex-1"
                    v-model="formData.putinType"
                    placeholder="请选择申请类型"
                >
                    <el-option label="1" value="1" />
                </el-select>
            </el-form-item>
            <el-form-item label="处理人" prop="conductor" class="w-[47%]">
                <el-input v-model="formData.conductor" placeholder="请输入处理人" />
            </el-form-item>
            <el-form-item label="处理人部门" prop="conductor" class="w-[47%]">
                <el-input v-model="formData.conductor" />
            </el-form-item>
            <el-form-item label="业务员" prop="putinType" class="w-[47%]">
                <el-select v-model="formData.putinType" clearable class="flex-1">
                    <el-option label="张三" value="1" />
                    <el-option label="李四" value="2" />
                    <el-option label="王五" value="3" />
                </el-select>
            </el-form-item>
            <el-form-item label="业务助理" prop="putinType" class="w-[47%]">
                <el-select v-model="formData.putinType" clearable class="flex-1">
                    <el-option label="张三" value="1" />
                    <el-option label="李四" value="2" />
                    <el-option label="王五" value="3" />
                </el-select>
            </el-form-item>
            <el-form-item label="客户/内部期限" prop="internalWearLife" class="w-[47%]">
                <el-date-picker
                    class="flex-1 !flex"
                    v-model="formData.internalWearLife"
                    type="datetime"
                    clearable
                    value-format="YYYY-MM-DD hh:mm:ss"
                    placeholder="请选择内部期限"
                />
            </el-form-item>
            <el-form-item label="官方期限" class="w-[47%]">
                <el-input placeholder="官方期限" />
            </el-form-item>
            <el-form-item label="专利标签" class="w-[47%]">
                <el-input placeholder="专利标签" />
            </el-form-item>
            <el-form-item label="客户名称" class="w-[47%]">
                <el-input placeholder="客户名称" />
            </el-form-item>
            <el-form-item label="客户文号" prop="customerDocumentNumber" class="w-[47%]">
                <el-input v-model="formData.customerDocumentNumber" placeholder="请输入客户文号" />
            </el-form-item>
            <el-form-item label="案件系数" class="w-[47%]">
                <el-input placeholder="请输入案件系数" />
            </el-form-item>
        </el-form>
        <el-card class="!border-none mt-4" shadow="never">
            <div>
                <el-form-item>
                    <b>附件信息</b>
                    <el-button type="primary">
                        <template #icon>
                            <icon name="local-icon-xiazai" />
                        </template>
                        批量下载
                    </el-button>
                    <el-button type="primary">
                        <template #icon>
                            <icon name="local-icon-shangchuan" />
                        </template>
                        上传附件
                    </el-button>
                    <el-button type="primary">
                        <template #icon>
                            <icon name="el-icon-Plus" />
                        </template>
                        选择案子所有附件
                    </el-button>
                    <el-button type="primary">
                        <template #icon>
                            <icon name="local-icon-qiehuan" />
                        </template>
                        转定稿文件
                    </el-button>
                </el-form-item>
            </div>
            <el-table class="mt-4" size="large" stripe>
                <el-table-column label="附件名称" prop="ourRef" min-width="180" />
                <el-table-column label="文件类型" prop="caseName" min-width="180" />
                <el-table-column label="文件描述" prop="test" min-width="180" />
                <el-table-column label="上传者" prop="handlingInformation" min-width="180" />
                <el-table-column label="流程阶段" prop="putinType" min-width="180" />
                <el-table-column label="是否已定稿" prop="test" min-width="180" />
                <el-table-column label="上传时间" prop="test" min-width="180" />
                <el-table-column label="文件来源" prop="test" min-width="180" />
                <el-table-column label="操作" width="120" fixed="right">
                    <template #default="{ row }">
                        <el-button
                            v-perms="['case:edit']"
                            type="primary"
                            link
                            @click="handleEdit(row)"
                        >
                            编辑
                        </el-button>
                    </template>
                </el-table-column>
            </el-table>
        </el-card>
        <el-card class="!border-none mt-4" shadow="never">
            <b>同时核稿案件</b>
            <el-table class="mt-4" size="large">
                <el-table-column label="序号" prop="ourRef" min-width="180" />
                <el-table-column label="案号" prop="caseName" min-width="180" />
                <el-table-column label="案件名称" prop="test" min-width="180" />
                <el-table-column label="处理事项" prop="test" min-width="180" />
                <el-table-column label="申请类型" prop="test" min-width="180" />
                <el-table-column label="操作" width="120" fixed="right">
                    <template #default="{ row }">
                        <el-button
                            v-perms="['case:edit']"
                            type="primary"
                            link
                            @click="handleEdit(row)"
                        >
                            编辑
                        </el-button>
                    </template>
                </el-table-column>
            </el-table>
        </el-card>
    </div>
    <el-card class="!border-none mt-4" shadow="never">
        <div>
            <el-form-item>
                <b>核稿记录</b>
                <el-button v-perms="['case:add']" type="primary" @click="handleAdd()">
                    <template #icon>
                        <icon name="el-icon-Plus" />
                    </template>
                    添加当前流程备注
                </el-button>
            </el-form-item>
        </div>
        <el-table class="mt-4" size="large">
            <el-table-column label="序号" prop="ourRef" min-width="180" />
            <el-table-column label="流程阶段" prop="caseName" min-width="180" />
            <el-table-column label="办理人员" prop="test" min-width="180" />
            <el-table-column label="办理时间" prop="handlingInformation" min-width="180" />
            <el-table-column label="办理结果" prop="putinType" min-width="180" />
            <el-table-column label="办理意见" prop="test" min-width="180" />
        </el-table>
    </el-card>
    <edit-popup v-if="showEdit" ref="editRef" @close="showEdit = false" />
</template>
<script lang="ts" setup>
import type { FormInstance } from 'element-plus'
import { caseEdit, caseAdd, caseDetail } from '@/api/case'
import Popup from '@/components/popup/index.vue'
import feedback from '@/utils/feedback'
import EditPopup from './edit.vue'
const editRef = shallowRef<InstanceType<typeof EditPopup>>()
const showEdit = ref(false)
import type { PropType } from 'vue'
const route = useRoute()
const router = useRouter()
defineProps({
    dictData: {
        type: Object as PropType<Record<string, any[]>>,
        default: () => ({})
    }
})
const emit = defineEmits(['success', 'close'])
const formRef = shallowRef<FormInstance>()
const popupRef = shallowRef<InstanceType<typeof Popup>>()
const mode = ref('add')
const popupTitle = computed(() => {
    return mode.value == 'edit' ? '编辑新建合同案件信息' : '新增新建合同案件信息'
})

const formData = reactive({
    caseName: '',
    caseType: '',
    businessType: '',
    putinType: '',
    undertakingDepartment: '',
    conductor: '',
    taxRate: '',
    costType: '',
    cost: '',
    contributionPool: '',
    ownershipDistribution: '',
    haveCase: '',
    designatedCountry: '',
    brandType: '',
    classQuantity: '',
    quantity: '',
    officialFee: '',
    agencyFee: '',
    hirdPartyPayment: '',
    signedAmount: '',
    invoiceValue: '',
    fundsReceived: '',
    paidupDate: '',
    planNumber: '',
    caseStatus: '',
    caseLink: '',
    remark: '',
    caseNameid: '',
    businessTypeid: '',
    undertakingDepartmentid: '',
    ownershipDistributionid: '',
    costTypeid: '',
    correlationTypeid: '',
    isRegister: '',
    isInvalid: '',
    isExistingcase: '',
    isPapernotice: '',
    customerDocumentNumber: '',
    copyrightType: '',
    caseFlow: '',
    countryOfOrigin: '',
    agency: '',
    proposalForm: '',
    isMaterials: '',
    isFund: '',
    initialPeriod: '',
    referenceNumber: '',
    contractNumber: '',
    budget: '',
    author: '',
    homeLocation: '',
    softwareAbbreviation: '',
    versionNumber: '',
    softwareWorkDescription: '',
    developmentCompletionDate: '',
    publishedStatus: '',
    hardwareEnvironment: '',
    softwareEnvironment: '',
    programmingLanguage: '',
    sourceQuantity: '',
    functionAndArt: '',
    handlingInformation: '',
    principalDates: '',
    customerTerm: '',
    internalWearLife: '',
    isStateCompensation: '',
    click: '',
    partOwner: '',
    todonote: '',
    manageDate: '',
    countType: '',
    numberOfPoints: '',
    addtotalstatepoint: '',
    royaltyDate: '',
    workPoints: '',
    creator: '',
    chargeType: '',
    currency: '',
    sum: '',
    advancePaymentDate: '',
    paymentRequestNumber: '',
    requestedDate: '',
    accountsDate: '',
    invoiceNumber: '',
    chargeName: '',
    chargeDepict: '',
    chargeDepictfine: '',
    extendedAmount: '',
    discountRate: '',
    count: '',
    parities: '',
    collectingCompanyAccount: '',
    collectionStatus: '',
    accountDetails: '',
    slt: '',
    externalBillingNumber: '',
    externalBillingDate: '',
    beddingCondition: '',
    handOver: '',
    expenseNote: '',
    reductionType: '',
    actualCurrency: '',
    officialDeadline: '',
    ourRef: '',
    relevantCaseName: '',
    correlationType: '',
    userId: '',
    userName: '',
    id: '',
    updateUserId: '',
    updateUserName: ''
})

const formRules = {
    caseName: [
        {
            required: true,
            message: '请输入案件名称',
            trigger: ['blur']
        }
    ],
    businessType: [
        {
            required: true,
            message: '请选择业务类型',
            trigger: ['blur']
        }
    ],
    undertakingDepartment: [
        {
            required: true,
            message: '请选择承办部门',
            trigger: ['blur']
        }
    ],
    designatedCountry: [
        {
            required: true,
            message: '请输入申请国家（地区）',
            trigger: ['blur']
        }
    ],
    handlingInformation: [
        {
            required: true,
            message: '请输入处理事项',
            trigger: ['blur']
        }
    ],
    id: [
        {
            required: true,
            message: '请输入主键ID',
            trigger: ['blur']
        }
    ]
}

const handleSubmit = async () => {
    await formRef.value?.validate()
    const data: any = { ...formData }
    if (route.query.id) {
        await caseEdit(data)
    } else {
        await caseAdd(data)
    }
    router.back()
    feedback.msgSuccess('操作成功')
    emit('success')
}

const open = (type = 'add') => {
    mode.value = type
    popupRef.value?.open()
}

const setFormData = async (data: Record<string, any>) => {
    for (const key in formData) {
        if (data[key] != null && data[key] != undefined) {
            //@ts-ignore
            formData[key] = data[key]
        }
    }
}

const getDetail = async () => {
    const data = await caseDetail({
        id: route.query.id
    })
    //alert(route.query.id);
    console.log(route.query.id)
    setFormData(data)
}

route.query.id && getDetail()

const disabled = ref(false)

const disabledAll = async () => {
    disabled.value = true
    getDetail()
}

const handleClose = () => {
    emit('close')
}
const handleAdd = async () => {
    showEdit.value = true
    await nextTick()
    editRef.value?.open('add')
}

defineExpose({
    open,
    setFormData,
    getDetail
})
</script>
<style scoped>
b {
    padding-right: 45px;
}
</style>
